
<!DOCTYPE html>
    <html lang="en">

    <head>
        <meta charset="utf-8" />
        <title>hello</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="Premium Bootstrap 4 Landing Page Template" />
        <meta name="keywords" content="bootstrap 4, premium, marketing, multipurpose" />
        <meta content="Shreethemes" name="author" />
        <!-- favicon -->
<!--        <link rel="shortcut icon" href="images/favicon.ico">-->
        <!-- Bootstrap css -->
        <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <!-- 图标库 -->
        <link href="css/materialdesignicons.min.css" rel="stylesheet" type="text/css" />
        <link rel="stylesheet" href="https://unicons.iconscout.com/release/v2.1.5/css/unicons.css" />
        <!-- Pe7 Icon -->
        <link rel="stylesheet" type="text/css" href="css/pe-icon-7.css">
        <!-- Icons -->
        <link href="css/magnific-popup.css" rel="stylesheet" type="text/css" />
        <!-- Main css File -->
        <link href="css/style.css" rel="stylesheet" type="text/css" />
        <link href="css/colors/default.css" rel="stylesheet" id="color-opt">

    </head>

    <body>
        <!-- Navbar STart -->
        <header id="topnav" class="defaultscroll sticky">
            <div class="container">
                <!-- Logo container-->
                <div>
                    <a class="logo" target="_blank">
                        <!-- Landkey -->
                        Lookup
                    </a>
                </div>
                <div class="buy-button">
<!--                    <a href="javascript:void(0)" class="btn btn-primary">Sign in</a>-->
                </div><!--end login button--><!-- end login button -->
                <!-- End Logo container-->
                <div class="menu-extras">
                    <div class="menu-item">
                        <!-- Mobile menu toggle-->
                        <a class="navbar-toggle">
                            <div class="lines">
                                <span></span>
                                <span></span>
                                <span></span>
                            </div>
                        </a>
                        <!-- End mobile menu toggle-->
                    </div>
                </div>

                <div id="navigation">
                    <!-- Navigation Menu-->
                    <ul class="navigation-menu nav-light">
<!--                        class加active则home这个超链接会被选中-->
                        <li class="has-submenu">
                            <a href="#home">项目简介</a>
                        </li>
                        <li class="has-submenu">
                            <!--#about就会跳到id为about的位置-->
                            <a href="#about">队伍介绍</a>
                        </li>
<!--                        <li class="has-submenu">-->
<!--                            <a href="#price">Plans</a>-->
<!--                        </li>-->
<!--                        <li class="has-submenu">-->
<!--                            <a href="#blog">Blog & News</a>-->
<!--                        </li>-->
<!--                        <li class="has-submenu">-->
<!--                            <a href="#contact">Contact</a>-->
<!--                        </li>-->
                    </ul><!--end navigation menu-->
                </div><!--end navigation-->
            </div><!--end container-->
        </header><!--end header-->
        <!-- Navbar End -->

        <!-- Start Home -->
        <section class="bg-half-260 d-table w-100" data-jarallax='{"speed": 0.5}' style="background: url('images/bg/背景图片.jpg') center center;" id="home">
            <div class="bg-overlay"></div>
            <div class="container">
                <div class="row mt-5 justify-content-center">
                    <div class="col-12">
                        <div class="title-heading text-center text-white">
                            <h4 class="display-4 letter-spacing font-weight-bold mb-3">项目简介</h4>
                            <p class="para-desc mx-auto">
                                本项目立足0-6岁幼儿不同的身心发展特点，结合传统非遗醒狮与现代科学技术，开发多语种的核心语言功能，
                                致力于打造一系列集观赏、启蒙、益智、人文、数字、科技为一体的醒狮多元智能化产品，如陪伴语音智能型机械醒狮，
                                AR虚拟醒狮等。团队将始终秉持“以文化人，智取未来”的理念，讲好中国故事，让传统非遗醒狮文化走向更广阔的世界。
                            </p>
                            <h4 class="display-4 letter-spacing font-weight-bold mb-3"></h4>
                            <h5 class="display-4 letter-spacing font-weight-bold mb-3">核心优势</h5>
                            <p class="para-desc mx-auto">
                                1.智能互动功能
                            </p>
                            <p class="para-desc mx-auto">  2.多语言多语种功能</p>
                            <p class="para-desc mx-auto"> 3.细分0-6岁幼儿年龄段优势</p>
                            <p class="para-desc mx-auto">  4.配备多种皮肤颜色</p>
                            <p class="para-desc mx-auto">  5.符合幼儿认知特点的防沉迷系统</p>
                            <p class="para-desc mx-auto"> 6.与粤剧经典曲目相融合创编主题曲</p>

                            <!--                            <div class="watch-video mt-4">-->
<!--                                <a href="#about" class="btn btn-primary mb-2">核心优势</a>-->
<!--                                <a href="http://vimeo.com/99025203" class="video-play-icon watch text-white font-weight-bold mb-2 ml-2"><i class="mdi mdi-play play-icon-circle text-center d-inline-block mr-2 rounded-circle text-white position-relative play play-iconbar"></i> Watch now !</a>-->
<!--                            </div>-->
                        </div>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
        </section><!--end section-->
        <!-- End Home -->

<!--        &lt;!&ndash; Partners start &ndash;&gt;-->
<!--        <section class="py-4 bg-light">-->
<!--            <div class="container">-->
<!--                <div class="row justify-content-center">-->
<!--                    <div class="col-lg-2 col-md-2 col-6 text-center py-4">-->
<!--                        <img src="images/client/amazon.svg" class="avatar avatar-ex-sm" alt="">-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-2 col-md-2 col-6 text-center py-4">-->
<!--                        <img src="images/client/google.svg" class="avatar avatar-ex-sm" alt="">-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-2 col-md-2 col-6 text-center py-4">-->
<!--                        <img src="images/client/lenovo.svg" class="avatar avatar-ex-sm" alt="">-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-2 col-md-2 col-6 text-center py-4">-->
<!--                        <img src="images/client/paypal.svg" class="avatar avatar-ex-sm" alt="">-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-2 col-md-2 col-6 text-center py-4">-->
<!--                        <img src="images/client/shopify.svg" class="avatar avatar-ex-sm" alt="">-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-2 col-md-2 col-6 text-center py-4">-->
<!--                        <img src="images/client/spotify.svg" class="avatar avatar-ex-sm" alt="">-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--            </div>&lt;!&ndash;end container&ndash;&gt;-->
<!--        </section>&lt;!&ndash;end section&ndash;&gt;-->
<!--        &lt;!&ndash; Partners End &ndash;&gt;-->

<!--        &lt;!&ndash; About Start &ndash;&gt;-->
<!--        <section class="section" id="about">-->
<!--            <i class="container"></i>-->
<!--                <i class="row align-items-center"></i>-->
<!--                    <div class="col-lg-6 col-md-6 order-2 order-md-1 mt-4 pt-2 mt-sm-0 opt-sm-0">-->
<!--                        <div class="row align-items-center">-->
<!--                            <div class="col-lg-6 col-md-6 col-6">-->
<!--                                <div class="row">-->
<!--                                    <div class="col-lg-12 col-md-12 mt-4 pt-2">-->
<!--                                        <div class="card work-desk rounded border-0 shadow-lg overflow-hidden">-->
<!--                                            <img src="images/about/ab02.jpg" class="img-fluid" alt="Image">-->
<!--                                            <div class="img-overlay bg-dark"></div>-->
<!--                                            <a href="images/about/ab02.jpg" class="mfp-image">-->
<!--                                                <div class="icon bg-primary text-center rounded-circle">-->
<!--                                                    <i data-feather="plus" class="fea icons text-white icon-ex-md"></i>-->
<!--                                                </div>-->
<!--                                            </a>-->
<!--                                        </div>-->
<!--                                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--&lt;!&ndash;                                    <div class="col-12">&ndash;&gt;-->
<!--&lt;!&ndash;                                        <div class="mt-4 pt-2 text-right">&ndash;&gt;-->
<!--&lt;!&ndash;                                            <a href="javascript:void(0)" class="btn btn-primary">Read More <i data-feather="chevron-right" class="fea icon-sm"></i></a>&ndash;&gt;-->
<!--&lt;!&ndash;                                        </div>&ndash;&gt;-->
<!--&lt;!&ndash;                                    </div>&ndash;&gt;-->
<!--                                </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--                            </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                            <div class="col-lg-6 col-md-6 col-6">-->
<!--                                <div class="row">-->
<!--                                    <div class="col-lg-12 col-md-12">-->
<!--                                        <div class="card work-desk rounded border-0 shadow-lg overflow-hidden">-->
<!--                                            <img src="images/about/ab03.jpg" class="img-fluid" alt="Image">-->
<!--                                            <div class="img-overlay bg-dark"></div>-->
<!--                                            <a href="images/about/ab03.jpg" class="mfp-image">-->
<!--                                                <div class="icon bg-primary shadow-lg text-center rounded-circle">-->
<!--                                                    <i data-feather="plus" class="fea icons text-white icon-ex-md"></i>-->
<!--                                                </div>-->
<!--                                            </a>-->
<!--                                        </div>-->
<!--                                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                                    <div class="col-lg-12 col-md-12 mt-4 pt-2">-->
<!--                                        <div class="card work-desk rounded border-0 shadow-lg overflow-hidden">-->
<!--                                            <img src="images/about/ab04.jpg" class="img-fluid" alt="Image">-->
<!--                                            <div class="img-overlay bg-dark"></div>-->
<!--                                            <a href="images/about/ab04.jpg" class="mfp-image">-->
<!--                                                <div class="icon bg-primary shadow-lg text-center rounded-circle">-->
<!--                                                    <i data-feather="plus" class="fea icons text-white icon-ex-md"></i>-->
<!--                                                </div>-->
<!--                                            </a>-->
<!--                                        </div>-->
<!--                                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                                </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--                            </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                        </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <i class="col-lg-6 col-md-6 col-12 order-1 order-md-2"></i>-->
<!--                        <i class="section-title ml-lg-5"></i>-->
<!--&lt;!&ndash;                            class="text-primary font-weight-normal mb-3"&ndash;&gt;-->
<!--                            <h5 >指导老师介绍</h5>-->
<!--                            <div width="1000">-->
<!--                                <img width="343" src="images/features/老师1.png" alt="">-->
<!--                                <i >谢德新</i>-->
<!--                                <h6>教育科学学院副院长、副教授，硕士生导师</h6>-->
<!--                                <p>公开发表学术论文20多篇，其中核心及其以上论文16篇，被人大复印资料全文转载2篇；-->
<!--                                    主持（完成）科研项目8项，省部级4项，参研全国教育科学规划国家级项目2项和教育部人文社会科学项目1项；-->
<!--                                    主持广东省研究生教育创新计划项目3项。论文在国务院扶贫办征文活动中被评为获奖论文；-->
<!--                                    获广东省高等教育学会高等教育研究成果奖一等奖。</p>-->
<!--                            </div>-->
<!--                            <div class="teacher">-->
<!--                                <img src="images/features/老师2.png" alt="">-->
<!--                                <i >张娟娟</i>-->
<!--                                <h6>山川方物蓝染工作坊负责人</h6>-->
<!--                                <p>西安美术学院美术专业，香港服装设计学院毕业，从事服装、包袋等开发设计工作20余年。-->
<!--                                    专注非遗蓝染、手织布及相关的产品设计研发，深入贵州黔东南少数民族地区，开启了全新的与大自然、“与蓝共舞”-->
<!--                                    的传统非遗探索之旅。持续学习和研究蓝染、蜡染、豆染、蓝印花布、手织侗布等多项非遗传统技艺。</p>-->
<!--                            </div>-->
<!--&lt;!&ndash;                            <h4 class="title mb-4">Our mission is to <br> 队伍介绍</h4>&ndash;&gt;-->
<!--&lt;!&ndash;                            <p class="text-muted mb-0">Lorem, ipsum dolor sit amet consectetur adipisicing elit quod debitis praesentium pariatur temporibus ipsa, cum quidem obcaecati sunt?</p>&ndash;&gt;-->
<!--&lt;!&ndash;                            class="img-fluid"&ndash;&gt;-->

<!--                            <h5 id = "team">团队成员介绍</h5>-->
<!--                            <h6>“智启南狮”队</h6>-->
<!--                            <style>-->
<!--                                #touxiang {-->
<!--                                    margin-bottom: 10px;-->
<!--                                    margin-top: 10px;-->
<!--                                }-->
<!--                                #team {-->
<!--                                    margin-top: 40px;-->
<!--                                }-->
<!--                            </style>-->
<!--                            <div id = "touxiang">-->
<!--                                <img src="images/features/队员1.png" alt="">-->
<!--                                <i >贺子轩(负责人)</i>-->
<!--                                <img src="images/features/队员2.png" alt="">-->
<!--                                <i  >王苏琪</i>-->
<!--                                <img src="images/features/队员3.png" alt="">-->
<!--                                <i >李国豫</i>-->
<!--                            </div>-->
<!--                            <div>-->
<!--                                <img src="images/features/队员4.png" alt="">-->
<!--                                <i  >潘敏妮</i>-->
<!--                                <img src="images/features/队员5.png" alt="">-->
<!--                                <i  >郑瀚</i>-->
<!--                            </div>-->
<!--                            <div class="row">-->
<!--                                <div class="col-lg-6 mt-4 pt-2">-->
<!--                                    <div class="media align-items-center rounded shadow p-3">-->
<!--                                        <i data-feather="airplay" class="fea text-primary"></i>-->
<!--                                        <h6 class="ml-3 mb-0"><a href="javascript:void(0)" class="text-dark">Responsive</a></h6>-->
<!--                                    </div>-->


<!--                                </div>-->


<!--                                <div class="col-lg-6 mt-4 pt-2">-->
<!--                                    <div class="media align-items-center rounded shadow p-3">-->
<!--                                        <i data-feather="download" class="fea text-primary"></i>-->
<!--                                        <h6 class="ml-3 mb-0"><a href="javascript:void(0)" class="text-dark">Free Download</a></h6>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="col-lg-6 mt-4 pt-2">-->
<!--                                    <div class="media align-items-center rounded shadow p-3">-->
<!--                                        <i data-feather="user" class="fea text-primary"></i>-->
<!--                                        <h6 class="ml-3 mb-0"><a href="javascript:void(0)" class="text-dark">Support</a></h6>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="col-lg-6 mt-4 pt-2">-->
<!--                                    <div class="media align-items-center rounded shadow p-3">-->
<!--                                        <i data-feather="codepen" class="fea text-primary"></i>-->
<!--                                        <h6 class="ml-3 mb-0"><a href="javascript:void(0)" class="text-dark">Development</a></h6>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="col-12 mt-4 pt-2">-->
<!--                                    <div class="watch-video">-->
<!--                                        <a href="http://vimeo.com/99025203" class="video-play-icon watch font-weight-bold title-dark text-dark"><i class="mdi mdi-play play-icon-circle text-center d-inline-block mr-2 rounded-circle text-white title-dark position-relative play play-iconbar"></i> Watch Now</a>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                           </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                </div>&lt;!&ndash;enr row&ndash;&gt;-->
<!--            </div>&lt;!&ndash;end container&ndash;&gt;-->
<!--        </section>-->
<!--&lt;!&ndash;         End About &ndash;&gt;-->


        <!-- About Start -->
        <section class="section" id="about">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-6 col-md-6 order-2 order-md-1 mt-4 pt-2 mt-sm-0 opt-sm-0">
                        <div class="row align-items-center">
                            <div class="col-lg-6 col-md-6 col-6">
                                <div class="row">
                                    <div class="col-lg-12 col-md-12 mt-4 pt-2">
                                        <div class="card work-desk rounded border-0 shadow-lg overflow-hidden">
                                            <img src="images/about/图片3.jpeg" class="img-fluid" alt="Image">
                                            <div class="img-overlay bg-dark"></div>
                                            <a href="images/about/图片3.jpeg" class="mfp-image">
                                                <div class="icon bg-primary text-center rounded-circle">
                                                    <i data-feather="plus" class="fea icons text-white icon-ex-md"></i>
                                                </div>
                                            </a>
                                        </div>
                                    </div><!--end col-->

                                    <div class="col-12">
<!--                                        <div class="mt-4 pt-2 text-right">-->
<!--                                            <a href="javascript:void(0)" class="btn btn-primary">Read More <i data-feather="chevron-right" class="fea icon-sm"></i></a>-->
<!--                                        </div>-->
                                    </div>
                                </div><!--end row-->
                            </div><!--end col-->

                            <div class="col-lg-6 col-md-6 col-6">
                                <div class="row">
                                    <div class="col-lg-12 col-md-12">
                                        <div class="card work-desk rounded border-0 shadow-lg overflow-hidden">
                                            <img src="images/about/图片2.jpg" class="img-fluid" alt="Image">
                                            <div class="img-overlay bg-dark"></div>
                                            <a href="images/about/图片2.jpg" class="mfp-image">
                                                <div class="icon bg-primary shadow-lg text-center rounded-circle">
                                                    <i data-feather="plus" class="fea icons text-white icon-ex-md"></i>
                                                </div>
                                            </a>
                                        </div>
                                    </div><!--end col-->

                                    <div class="col-lg-12 col-md-12 mt-4 pt-2">
                                        <div class="card work-desk rounded border-0 shadow-lg overflow-hidden">
                                            <img src="images/about/图片1.jpg" class="img-fluid" alt="Image">
                                            <div class="img-overlay bg-dark"></div>
                                            <a href="images/about/图片1.jpg" class="mfp-image">
                                                <div class="icon bg-primary shadow-lg text-center rounded-circle">
                                                    <i data-feather="plus" class="fea icons text-white icon-ex-md"></i>
                                                </div>
                                            </a>
                                        </div>
                                    </div><!--end col-->
                                </div><!--end row-->
                            </div><!--end col-->
                        </div><!--end row-->
                    </div><!--end col-->

                    <div class="col-lg-6 col-md-6 col-12 order-1 order-md-2">
                        <div class="section-title ml-lg-5">
<!--                            <h4 class="text-primary  font-weight-normal">指导老师介绍</h4>-->
<!--                            <h9 class="title mb-4">Our mission is to <br> make your life easier.</h9>-->
<!--                            <p class="text-muted mb-0">Lorem, ipsum dolor sit amet consectetur adipisicing elit quod debitis praesentium pariatur temporibus ipsa, cum quidem obcaecati sunt?</p>-->
                            <h3>团队成员介绍</h3>
                                                        <h6>“智启南狮”队</h6>
                                                        <style>
                                                            #touxiang {
                                                                margin-bottom: 10px;
                                                                margin-top: 10px;
                                                            }
                                                            #team {
                                                                margin-top: 40px;
                                                            }
                                                        </style>
                                                        <div id = "touxiang">
                                                            <img src="images/features/队员1.png" alt="">
                                                            <i >贺子轩(负责人)</i>
                                                            <img src="images/features/队员2.png" alt="">
                                                            <i  >王苏琪</i>
                                                            <img src="images/features/队员3.png" alt="">
                                                            <i >李国豫</i>
                                                        </div>
                                                        <div>
                                                            <img src="images/features/队员4.png" alt="">
                                                            <i  >潘敏妮</i>
                                                            <img src="images/features/队员5.png" alt="">
                                                            <i  >郑瀚</i>
                                                        </div>
<!--                            <div class="row">-->
<!--                                <div class="col-lg-6 mt-4 pt-2">-->
<!--                                    <div class="media align-items-center rounded shadow p-3">-->
<!--                                        <i data-feather="airplay" class="fea text-primary"></i>-->
<!--                                        <h6 class="ml-3 mb-0"><a href="javascript:void(0)" class="text-dark">Responsive</a></h6>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="col-lg-6 mt-4 pt-2">-->
<!--                                    <div class="media align-items-center rounded shadow p-3">-->
<!--                                        <i data-feather="download" class="fea text-primary"></i>-->
<!--                                        <h6 class="ml-3 mb-0"><a href="javascript:void(0)" class="text-dark">Free Download</a></h6>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="col-lg-6 mt-4 pt-2">-->
<!--                                    <div class="media align-items-center rounded shadow p-3">-->
<!--                                        <i data-feather="user" class="fea text-primary"></i>-->
<!--                                        <h6 class="ml-3 mb-0"><a href="javascript:void(0)" class="text-dark">Support</a></h6>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="col-lg-6 mt-4 pt-2">-->
<!--                                    <div class="media align-items-center rounded shadow p-3">-->
<!--                                        <i data-feather="codepen" class="fea text-primary"></i>-->
<!--                                        <h6 class="ml-3 mb-0"><a href="javascript:void(0)" class="text-dark">Development</a></h6>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="col-12 mt-4 pt-2">-->
<!--                                    <div class="watch-video">-->
<!--                                        <a href="http://vimeo.com/99025203" class="video-play-icon watch font-weight-bold title-dark text-dark"><i class="mdi mdi-play play-icon-circle text-center d-inline-block mr-2 rounded-circle text-white title-dark position-relative play play-iconbar"></i> Watch Now</a>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                            </div>-->
                        </div>
                    </div><!--end col-->
                </div><!--enr row-->
            </div><!--end container-->
        </section>
        <!-- End About -->


        <!-- Services Start -->
        <section class="section bg-light" id="service">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-12">
                        <style>
                            #zhidaolaoshijieshao {
                                margin-top: 30px;
                            }
                        </style>
                        <div id="zhidaolaoshijieshao">
                        <h3>指导老师介绍</h3>

                        </div >
<!--                            <h6 class="title mb-4">指导老师介绍</h6>-->
<!--                            <p class="text-muted para-desc mx-auto mb-0">There is now an abundance of readable 
dummy texts. These are usually used when a text is required purely to fill a space.</p>-->
<!--                        <style>-->
<!--                            /*#z{*/-->
<!--                            /*    display: flex;*/-->
<!--                            /*}*/-->
<!--                        </style>-->
<!--                        <div id = "z">-->
<!--                            <img src="images/features/老师1.png" class="img-fluid" alt="Image">-->
<!--                            <div><h4>谢德新</h4></div>-->
<!--                            <div><h6>教育科学学院副院长、副教授，硕士生导师</h6></div>-->
<!--                            <div>-->
<!--                                <p>公开发表学术论文20多篇，其中核心及其以上论文16篇，被人大复印资料全文转载2篇；-->
<!--                                主持（完成）科研项目8项，省部级4项，参研全国教育科学规划国家级项目2项和教育部人文社会科学项目1项；-->
<!--                                主持广东省研究生教育创新计划项目3项。论文在国务院扶贫办征文活动中被评为获奖论文；-->
<!--                                获广东省高等教育学会高等教育研究成果奖一等奖。</p>-->
<!--                            </div>-->
<!--                        </div>-->
                        <div class="row align-items-center">
                            <div class="col-lg-6 col-md-6">
                                <div class="mr-lg-5">
                                    <img src="images/features/老师1.png" class="img-fluid" alt="Image">
                                </div>
                            </div><!--end col-->

                            <div class="col-lg-6 col-md-6 mt-4 mt-sm-0 pt-2 pt-sm-0">
                                <div class="section-title">
<!--                                    <h2 class="text-primary">-->
<!--                                        <i class="uim uim-google-play"></i>-->
<!--                                    </h2>-->
                                    <h5 >谢德新 <br> 教育科学学院副院长、副教授，硕士生导师</h5>
<!--                                    <p class="text-muted para-desc">There is now an abundance of readable
dummy texts. These are usually used when a text is required purely to fill a space.</p>-->
                                    <ul class="list-unstyled feature-list text-muted">
                                        <li class="mt-2">公开发表学术论文20多篇，其中核心及其以上论文16篇，
                                            被人大复印资料全文转载2篇；主持（完成）科研项目8项，省部级4项，
                                            参研全国教育科学规划国家级项目2项和教育部人文社会科学项目1项；
                                            主持广东省研究生教育创新计划项目3项。论文在国务院扶贫办征文活动中被评为获奖论文；
                                            获广东省高等教育学会高等教育研究成果奖一等奖。</li>
<!--                                        <li class="mt-2"><i data-feather="check-circle" class="fea icon-ex-md text-success mr-2"></i>Our Talented & Experienced Marketing Agency</li>-->
<!--                                        <li class="mt-2"><i data-feather="check-circle" class="fea icon-ex-md text-success mr-2"></i>Create your own skin to match your brand</li>-->
                                    </ul>
<!--                                    <a href="javascript:void(0)" class="mt-3 text-primary">Find Out More <i class="mdi mdi-chevron-right"></i></a>-->
                                </div>
                            </div><!--end col-->



                        </div><!--end row-->

                        <div class="row align-items-center">
                            <div class="col-lg-6 col-md-6">
                                <div class="mr-lg-5">
                                    <img src="images/features/老师2.png" class="img-fluid" alt="Image">
                                </div>
                            </div><!--end col-->

                            <div class="col-lg-6 col-md-6 mt-4 mt-sm-0 pt-2 pt-sm-0">
                                <div class="section-title">
                                    <!--                                    <h2 class="text-primary">-->
                                    <!--                                        <i class="uim uim-google-play"></i>-->
                                    <!--                                    </h2>-->
                                    <h5 >张娟娟 <br> 山川方物蓝染工作坊负责人</h5>
                                    <!--                                    <p class="text-muted para-desc">There is now an abundance of readable
                                    dummy texts. These are usually used when a text is required purely to fill a space.</p>-->
                                    <ul class="list-unstyled feature-list text-muted">
                                        <li class="mt-2">公开发表学术论文20多篇，其中核心及其以上论文16篇，
                                            西安美术学院美术专业，香港服装设计学院毕业，从事服装、包袋等开发设计工作20余年。
                                            专注非遗蓝染、手织布及相关的产品设计研发，深入贵州黔东南少数民族地区，开启了全新的与大自然、
                                            “与蓝共舞”的传统非遗探索之旅。持续学习和研究蓝染、蜡染、豆染、蓝印花布、
                                            手织侗布等多项非遗传统技艺。</li>
                                        <!--                                        <li class="mt-2"><i data-feather="check-circle" class="fea icon-ex-md text-success mr-2"></i>Our Talented & Experienced Marketing Agency</li>-->
                                        <!--                                        <li class="mt-2"><i data-feather="check-circle" class="fea icon-ex-md text-success mr-2"></i>Create your own skin to match your brand</li>-->
                                    </ul>
<!--                                    <a href="javascript:void(0)" class="mt-3 text-primary">Find Out More <i class="mdi mdi-chevron-right"></i></a>-->
                                </div>
                            </div><!--end col-->



                        </div><!--end row-->
                    </div><!--end col-->
                </div><!--end row-->

<!--                <div class="row">-->
<!--                    <div class="col-lg-4 col-md-6 col-12 mt-4 pt-2">-->
<!--                        <div class="card service-wrapper rounded border-0 shadow px-4 py-5">-->
<!--                            <div class="icon text-center text-primary h1 shadow rounded bg-white">-->
<!--                                <i class="uim uim-airplay"></i>-->
<!--                            </div>-->
<!--                            <div class="content mt-4">-->
<!--                                <h5 class="title">Fully Responsive</h5>-->
<!--                                <p class="text-muted mt-3 mb-0">It is a long established fact that a reader will be distracted by the when looking at its layout.</p>-->
<!--                                <div class="mt-3">-->
<!--                                    <a href="javascript:void(0)" class="text-primary">Read More <i data-feather="chevron-right" class="fea icon-sm"></i></a>-->
<!--                                </div>-->
<!--                            </div>-->

<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-4 col-md-6 col-12 mt-4 pt-2">-->
<!--                        <div class="card service-wrapper rounded border-0 shadow px-4 py-5">-->
<!--                            <div class="icon text-center text-primary h1 shadow rounded bg-white">-->
<!--                                <i class="uim uim-circle-layer"></i>-->
<!--                            </div>-->
<!--                            <div class="content mt-4">-->
<!--                                <h5 class="title">Fresh Layouts</h5>-->
<!--                                <p class="text-muted mt-3 mb-0">It is a long established fact that a reader will be distracted by the when looking at its layout.</p>-->
<!--                                <div class="mt-3">-->
<!--                                    <a href="javascript:void(0)" class="text-primary">Read More <i data-feather="chevron-right" class="fea icon-sm"></i></a>-->
<!--                                </div>-->
<!--                            </div>-->

<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-4 col-md-6 col-12 mt-4 pt-2">-->
<!--                        <div class="card service-wrapper rounded border-0 shadow px-4 py-5">-->
<!--                            <div class="icon text-center text-primary h1 shadow rounded bg-white">-->
<!--                                <i class="uim uim-signal-alt-3"></i>-->
<!--                            </div>-->
<!--                            <div class="content mt-4">-->
<!--                                <h5 class="title">Minimalism Feast</h5>-->
<!--                                <p class="text-muted mt-3 mb-0">It is a long established fact that a reader will be distracted by the when looking at its layout.</p>-->
<!--                                <div class="mt-3">-->
<!--                                    <a href="javascript:void(0)" class="text-primary">Read More <i data-feather="chevron-right" class="fea icon-sm"></i></a>-->
<!--                                </div>-->
<!--                            </div>-->

<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-4 col-md-6 col-12 mt-4 pt-2">-->
<!--                        <div class="card service-wrapper rounded border-0 shadow px-4 py-5">-->
<!--                            <div class="icon text-center text-primary h1 shadow rounded bg-white">-->
<!--                                <i class="uim uim-flip-h-alt"></i>-->
<!--                            </div>-->
<!--                            <div class="content mt-4">-->
<!--                                <h5 class="title">Modern Workflow</h5>-->
<!--                                <p class="text-muted mt-3 mb-0">It is a long established fact that a reader will be distracted by the when looking at its layout.</p>-->
<!--                                <div class="mt-3">-->
<!--                                    <a href="javascript:void(0)" class="text-primary">Read More <i data-feather="chevron-right" class="fea icon-sm"></i></a>-->
<!--                                </div>-->
<!--                            </div>-->

<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-4 col-md-6 col-12 mt-4 pt-2">-->
<!--                        <div class="card service-wrapper rounded border-0 shadow px-4 py-5">-->
<!--                            <div class="icon text-center text-primary h1 shadow rounded bg-white">-->
<!--                                <i class="uim uim-flip-v"></i>-->
<!--                            </div>-->
<!--                            <div class="content mt-4">-->
<!--                                <h5 class="title">Unique Features</h5>-->
<!--                                <p class="text-muted mt-3 mb-0">It is a long established fact that a reader will be distracted by the when looking at its layout.</p>-->
<!--                                <div class="mt-3">-->
<!--                                    <a href="javascript:void(0)" class="text-primary">Read More <i data-feather="chevron-right" class="fea icon-sm"></i></a>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-4 col-md-6 col-12 mt-4 pt-2">-->
<!--                        <div class="card service-wrapper rounded border-0 shadow px-4 py-5">-->
<!--                            <div class="icon text-center text-primary h1 shadow rounded bg-white">-->
<!--                                <i class="uim uim-clock"></i>-->
<!--                            </div>-->
<!--                            <div class="content mt-4">-->
<!--                                <h5 class="title">Support 24/7</h5>-->
<!--                                <p class="text-muted mt-3 mb-0">It is a long established fact that a reader will be distracted by the when looking at its layout.</p>-->
<!--                                <div class="mt-3">-->
<!--                                    <a href="javascript:void(0)" class="text-primary">Read More <i data-feather="chevron-right" class="fea icon-sm"></i></a>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                </div>&lt;!&ndash;end row&ndash;&gt;-->
            </div><!--end container-->

<!--            <div class="container mt-100 mt-60">-->
<!--                <div class="row align-items-center">-->
<!--                    <div class="col-lg-6 col-md-6">-->
<!--                        <div class="mr-lg-5">-->
<!--                            <img src="images/features/svg-1.svg" class="img-fluid" alt="">-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-6 col-md-6 mt-4 mt-sm-0 pt-2 pt-sm-0">-->
<!--                        <div class="section-title">-->
<!--                            <h2 class="text-primary">-->
<!--                                <i class="uim uim-google-play"></i>-->
<!--                            </h2>-->
<!--                            <h4 class="title mt-3 mb-4">Ultimate features <br> that we built !</h4>-->
<!--                            <p class="text-muted para-desc">There is now an abundance of readable dummy texts. These are usually used when a text is required purely to fill a space.</p>-->
<!--                            <ul class="list-unstyled feature-list text-muted">-->
<!--                                <li class="mt-2"><i data-feather="check-circle" class="fea icon-ex-md text-success mr-2"></i>Digital Marketing Solutions for Tomorrow</li>-->
<!--                                <li class="mt-2"><i data-feather="check-circle" class="fea icon-ex-md text-success mr-2"></i>Our Talented & Experienced Marketing Agency</li>-->
<!--                                <li class="mt-2"><i data-feather="check-circle" class="fea icon-ex-md text-success mr-2"></i>Create your own skin to match your brand</li>-->
<!--                            </ul>-->
<!--                            <a href="javascript:void(0)" class="mt-3 text-primary">Find Out More <i class="mdi mdi-chevron-right"></i></a>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--            </div>&lt;!&ndash;end container&ndash;&gt;-->

<!--            <div class="container mt-100 mt-60">-->
<!--                <div class="row align-items-center">-->
<!--                    <div class="col-lg-6 col-md-6 order-1 order-md-2">-->
<!--                        <div class="ml-lg-5">-->
<!--                            <img src="images/features/svg-4.svg" class="img-fluid" alt="">-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-6 col-md-6 order-2 order-md-1 mt-4 mt-sm-0 pt-2 pt-sm-0">-->
<!--                        <div class="section-title">-->
<!--                            <h2 class="text-primary">-->
<!--                                <i class="uim uim-google-drive"></i>-->
<!--                            </h2>-->
<!--                            <h4 class="title mt-3 mb-4">Designed & Built by <br> latest code integration</h4>-->
<!--                            <p class="text-muted para-desc">There is now an abundance of readable dummy texts. These are usually used when a text is required purely to fill a space. These alternatives to the classic Lorem Ipsum texts are often amusing and tell short, funny or nonsensical stories.</p>-->
<!--                            <div class="mt-4">-->
<!--                                <a href="javascript:void(0)" class="btn btn-primary">Learn More <i data-feather="chevron-right" class="fea icon-sm"></i></a>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--            </div>&lt;!&ndash;end container&ndash;&gt;-->
        </section><!--end section-->
        <!-- Services End -->

<!--        &lt;!&ndash; Start Pricing &ndash;&gt;-->
<!--        <section class="section" id="price">-->
<!--            <div class="container">-->
<!--                <div class="row justify-content-center">-->
<!--                    <div class="col-12">-->
<!--                        <div class="section-title text-center mb-4 pb-2">-->
<!--                            <h4 class="title mb-4">Pricing Plans</h4>-->
<!--                            <p class="text-muted para-desc mx-auto mb-0">There is now an abundance of readable dummy texts. These are usually used when a text is required purely to fill a space.</p>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                </div>&lt;!&ndash;end row&ndash;&gt;-->

<!--                <div class="row">-->
<!--                    <div class="col-lg-3 col-md-6 col-12 mt-4 pt-2" data-aos="fade-up" data-aos-delay="100">-->
<!--                        <div class="card card-body align-items-center shadow">-->

<!--                            <div class="text-center mb-1">-->
<!--                                <h5 class="mb-3">Intro</h5>-->
<!--                                <div class="d-flex align-items-center mb-1">-->
<!--                                    &lt;!&ndash;<span class="h5 mb-0 mr-2">$</span>&ndash;&gt;-->
<!--                                    <span class="display-5 mb-0 text-dark mr-2">$19</span>-->
<!--                                    <span class="h5 align-self-center mb-0">/ month</span>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                            <ul class="list-unstyled p-0">-->
<!--                                <li class="my-3">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt check-icon text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary font-weight-bold"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">2GB Cloud Storage</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">100GB CDN Bandwidth</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">98.88% Uptime Guarantee</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3 opacity-50">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-danger-alt text-center">-->
<!--                                            <i data-feather="x" class="fea icon-sm text-danger"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">Personal Account Manager</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3 opacity-50">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-danger-alt text-center">-->
<!--                                            <i data-feather="x" class="fea icon-sm text-danger"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">Enterprise SLA</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                            </ul>-->
<!--                            <a href="#" class="btn btn-primary">Start with Intro</a>-->
<!--                        </div>-->
<!--                    </div>-->


<!--                    <div class="col-lg-3 col-md-6 col-12 mt-4 pt-2" data-aos="fade-up" data-aos-delay="100">-->
<!--                        <div class="card card-body align-items-center shadow bg-primary">-->

<!--                            <div class="text-center mb-1 text-white">-->
<!--                                <h5 class="mb-3">Basic</h5>-->
<!--                                <div class="d-flex align-items-center mb-1">-->
<!--                                    &lt;!&ndash;<span class="h5 mb-0 mr-2">$</span>&ndash;&gt;-->
<!--                                    <span class="display-5 mb-0 text-white mr-2">$39</span>-->
<!--                                    <span class="h5 align-self-center mb-0">/ month</span>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                            <ul class="list-unstyled p-0 text-white">-->
<!--                                <li class="my-3">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt bg-white-alt check-icon text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary font-weight-bold"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">2GB Cloud Storage</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt bg-white-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">100GB CDN Bandwidth</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt bg-white-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">98.88% Uptime Guarantee</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3 opacity-50">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt bg-white-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">Personal Account Manager</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3 opacity-50">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-danger-alt text-center">-->
<!--                                            <i data-feather="x" class="fea icon-sm text-white"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">Enterprise SLA</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                            </ul>-->
<!--                            <a href="#" class="btn btn-light">Start with Basic</a>-->
<!--                        </div>-->
<!--                    </div>-->

<!--                    <div class="col-lg-3 col-md-6 col-12 mt-4 pt-2" data-aos="fade-up" data-aos-delay="100">-->
<!--                        <div class="card card-body align-items-center shadow">-->

<!--                            <div class="text-center mb-1">-->
<!--                                <h5 class="mb-3">Popular</h5>-->
<!--                                <div class="d-flex align-items-center mb-1">-->
<!--                                    &lt;!&ndash;<span class="h5 mb-0 mr-2">$</span>&ndash;&gt;-->
<!--                                    <span class="display-5 mb-0 text-dark mr-2">$49</span>-->
<!--                                    <span class="h5 align-self-center mb-0">/ month</span>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                            <ul class="list-unstyled p-0">-->
<!--                                <li class="my-3">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt check-icon text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">2GB Cloud Storage</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">100GB CDN Bandwidth</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">98.88% Uptime Guarantee</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3 opacity-50">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">Personal Account Manager</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3 opacity-50">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">Enterprise SLA</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                            </ul>-->
<!--                            <a href="#" class="btn btn-primary">Start with Popular</a>-->
<!--                        </div>-->
<!--                    </div>-->

<!--                    <div class="col-lg-3 col-md-6 col-12 mt-4 pt-2" data-aos="fade-up" data-aos-delay="100">-->
<!--                        <div class="card card-body align-items-center shadow">-->

<!--                            <div class="text-center mb-1">-->
<!--                                <h5 class="mb-3">Enterpise</h5>-->
<!--                                <div class="d-flex align-items-center mb-1">-->
<!--                                    &lt;!&ndash;<span class="h5 mb-0 mr-2">$</span>&ndash;&gt;-->
<!--                                    <span class="display-5 mb-0 text-dark mr-2">$79</span>-->
<!--                                    <span class="h5 align-self-center mb-0">/ month</span>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                            <ul class="list-unstyled p-0">-->
<!--                                <li class="my-3">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt check-icon text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">2GB Cloud Storage</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">100GB CDN Bandwidth</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">98.88% Uptime Guarantee</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3 opacity-50">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">Personal Account Manager</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                                <li class="my-3 opacity-50">-->
<!--                                    <div class="d-flex align-items-center">-->
<!--                                        <div class="rounded-circle bg-success-alt text-center">-->
<!--                                            <i data-feather="check" class="fea icon-sm text-primary"></i>-->
<!--                                        </div>-->
<!--                                        <h6 class="mb-0 ml-3 font-14">Enterprise SLA</h6>-->
<!--                                    </div>-->
<!--                                </li>-->
<!--                            </ul>-->
<!--                            <a href="#" class="btn btn-primary">Start with Enterpise</a>-->
<!--                        </div>-->
<!--                    </div>-->

<!--                </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--            </div>&lt;!&ndash;end container&ndash;&gt;-->
<!--        </section>&lt;!&ndash;end section&ndash;&gt;-->
<!--        &lt;!&ndash; Start Pricing &ndash;&gt;-->

<!--        &lt;!&ndash; Start Blog &ndash;&gt;-->
<!--        <section class="section bg-light" id="blog">-->
<!--            <div class="container">-->
<!--                <div class="row justify-content-center">-->
<!--                    <div class="col-12">-->
<!--                        <div class="section-title text-center mb-4 pb-2">-->
<!--                            <h4 class="title mb-4">Latest News & Blogs</h4>-->
<!--                            <p class="text-muted para-desc mx-auto mb-0">There is now an abundance of readable dummy texts. These are usually used when a text is required purely to fill a space.</p>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                </div>&lt;!&ndash;end row&ndash;&gt;-->

<!--                <div class="row">-->
<!--                    <div class="col-lg-4 col-md-6 col-12 mt-4 pt-2">-->
<!--                        <div class="card blog-post border-0 shadow rounded position-relative overflow-hidden">-->
<!--                            <img src="images/blog/01.jpg" class="img-fluid" alt="">-->
<!--                            <div class="card-body content p-4 bg-white">-->
<!--                                <h5><a href="javascript:void(0)" class="card-title title text-dark">Media Optimization</a></h5>-->
<!--                                <p class="text-muted">There is now an abundance of readable dummy texts. These are purely to fill a space.</p>-->
<!--                                <a href="javascript:void(0)" class="text-primary">Read More <i data-feather="chevron-right" class="fea icon-sm"></i></a>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-4 col-md-6 col-12 mt-4 pt-2">-->
<!--                        <div class="card blog-post border-0 shadow rounded position-relative overflow-hidden">-->
<!--                            <img src="images/blog/02.jpg" class="img-fluid" alt="">-->
<!--                            <div class="card-body content p-4 bg-white">-->
<!--                                <h5><a href="javascript:void(0)" class="card-title title text-dark">Easy & Effective</a></h5>-->
<!--                                <p class="text-muted">There is now an abundance of readable dummy texts. These are purely to fill a space.</p>-->
<!--                                <a href="javascript:void(0)" class="text-primary">Read More <i data-feather="chevron-right" class="fea icon-sm"></i></a>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-lg-4 col-md-6 col-12 mt-4 pt-2">-->
<!--                        <div class="card blog-post border-0 shadow rounded position-relative overflow-hidden">-->
<!--                            <img src="images/blog/03.jpg" class="img-fluid" alt="">-->
<!--                            <div class="card-body content p-4 bg-white">-->
<!--                                <h5><a href="javascript:void(0)" class="card-title title text-dark">Google Links</a></h5>-->
<!--                                <p class="text-muted">There is now an abundance of readable dummy texts. These are purely to fill a space.</p>-->
<!--                                <a href="javascript:void(0)" class="text-primary">Read More <i data-feather="chevron-right" class="fea icon-sm"></i></a>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--            </div>&lt;!&ndash;end container&ndash;&gt;-->
<!--        </section>&lt;!&ndash;end section&ndash;&gt;-->
<!--        &lt;!&ndash; End Blog &ndash;&gt;-->

<!--        &lt;!&ndash; Start COntact &ndash;&gt;-->
<!--        <section class="section" id="contact">-->
<!--            <div class="container">-->
<!--                <div class="row justify-content-center">-->
<!--                    <div class="col-12">-->
<!--                        <div class="section-title text-center mb-4 pb-2">-->
<!--                            <h4 class="title mb-4">Contact us</h4>-->
<!--                            <p class="text-muted para-desc mx-auto mb-0">There is now an abundance of readable dummy texts. These are usually used when a text is required purely to fill a space.</p>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                </div>&lt;!&ndash;end row&ndash;&gt;-->

<!--                <div class="row">-->
<!--                    <div class="col-md-4 mt-4 pt-2">-->
<!--                        <div class="contact-detail text-center">-->
<!--                            <div class="icon">-->
<!--                                <i data-feather="phone" class="fea icon-md"></i>-->
<!--                            </div>-->
<!--                            <div class="content mt-4">-->
<!--                                <h6 class="title text-uppercase font-weight-bold">Phone</h6>-->
<!--                                <p class="text-muted">Promising development turmoil inclusive education transformative community</p>-->
<!--                                <a href="tel:+152534-468-854" class="text-primary">+152 534-468-854</a>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-md-4 mt-4 pt-2">-->
<!--                        <div class="contact-detail text-center">-->
<!--                            <div class="icon">-->
<!--                                <i data-feather="mail" class="fea icon-md"></i>-->
<!--                            </div>-->
<!--                            <div class="content mt-4">-->
<!--                                <h6 class="title text-uppercase font-weight-bold">Email</h6>-->
<!--                                <p class="text-muted">Promising development turmoil inclusive education transformative community</p>-->
<!--                                <a href="mailto:contact@example.com" class="text-primary">contact@example.com</a>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                    <div class="col-md-4 mt-4 pt-2">-->
<!--                        <div class="contact-detail text-center">-->
<!--                            <div class="icon">-->
<!--                                <i data-feather="map-pin" class="fea icon-md"></i>-->
<!--                            </div>-->
<!--                            <div class="content mt-4">-->
<!--                                <h6 class="title text-uppercase font-weight-bold">Location</h6>-->
<!--                                <p class="text-muted">C/54 Northwest Freeway, Suite 558, <br>Houston, USA 485</p>-->
<!--                                <a href="https://www.google.com/maps/embed?pb=!1m10!1m8!1m3!1d6030.418742494061!2d-111.34563870463673!3d26.01036670629853!3m2!1i1024!2i768!4f13.1!5e0!3m2!1ses-419!2smx!4v1471908546569" class="video-play-icon text-primary">View on Google map</a>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--            </div>&lt;!&ndash;end container&ndash;&gt;-->

<!--            <div class="container mt-100 mt-60">-->
<!--                <div class="row justify-content-center">-->
<!--                    <div class="col-lg-12">-->
<!--                        <div class="custom-form mb-sm-30">-->
<!--                            <div id="message"></div>-->
<!--                            <form method="post" action="php/contact.php" name="contact-form" id="contact-form">-->
<!--                                <div class="row">-->
<!--                                    <div class="col-lg-6">-->
<!--                                        <div class="row">-->
<!--                                            <div class="col-lg-12 col-md-6">-->
<!--                                                <div class="form-group">-->
<!--                                                    <input name="name" id="name" type="text" class="form-control border rounded" placeholder="First Name :">-->
<!--                                                </div>-->
<!--                                            </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                                            <div class="col-lg-12 col-md-6">-->
<!--                                                <div class="form-group">-->
<!--                                                    <input name="email" id="email2" type="email" class="form-control border rounded" placeholder="Your email :">-->
<!--                                                </div>-->
<!--                                            </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                                            <div class="col-lg-12">-->
<!--                                                <div class="form-group">-->
<!--                                                    <input name="subject" id="subject" class="form-control border rounded" placeholder="Your subject :">-->
<!--                                                </div>-->
<!--                                            </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                                        </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--                                    </div>&lt;!&ndash;end col&ndash;&gt;-->

<!--                                    <div class="col-lg-6">-->
<!--                                        <div class="form-group">-->
<!--                                            <textarea name="comments" id="comments" rows="4" class="form-control border rounded" placeholder="Your Message :"></textarea>-->
<!--                                        </div>-->
<!--                                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                                </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--                                <div class="row">-->
<!--                                    <div class="col-sm-12 text-right">-->
<!--                                        <input type="submit" id="submit" name="send" class="submitBnt btn btn-primary" value="Send Message">-->
<!--                                        <div id="simple-msg"></div>-->
<!--                                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                                </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--                            </form>&lt;!&ndash;end form&ndash;&gt;-->
<!--                        </div>&lt;!&ndash;end custom-form&ndash;&gt;-->
<!--                    </div>&lt;!&ndash;end col&ndash;&gt;-->
<!--                </div>&lt;!&ndash;end row&ndash;&gt;-->
<!--            </div>&lt;!&ndash;end container&ndash;&gt;-->
<!--        </section>&lt;!&ndash;end section&ndash;&gt;-->
<!--        &lt;!&ndash; End COntact &ndash;&gt;-->

<!--        &lt;!&ndash; Start Footer &ndash;&gt;-->
<!--        <footer class="bg-dark">-->
<!--            <div class="container">-->
<!--                <div class="row">-->
<!--                    <div class="col-lg-5 col-md-12">-->
<!--                        <a class="logo-footer text-white" href="#">-->
<!--                            Landkey-->
<!--                        </a>-->
<!--                        <p class="mt-4">There is now an abundance of readable dummy texts. These are is required purely to fill a space.</p>-->
<!--                        <ul class="list-unstyled social-icon social mb-0 mt-4">-->
<!--                            <li class="list-inline-item"><a href="javascript:void(0)" class="rounded"><i data-feather="facebook" class="fea icon-sm fea-social"></i></a></li>-->
<!--                            <li class="list-inline-item"><a href="javascript:void(0)" class="rounded"><i data-feather="instagram" class="fea icon-sm fea-social"></i></a></li>-->
<!--                            <li class="list-inline-item"><a href="javascript:void(0)" class="rounded"><i data-feather="twitter" class="fea icon-sm fea-social"></i></a></li>-->
<!--                            <li class="list-inline-item"><a href="javascript:void(0)" class="rounded"><i data-feather="linkedin" class="fea icon-sm fea-social"></i></a></li>-->
<!--                        </ul>&lt;!&ndash;end icon&ndash;&gt;-->
<!--                    </div>-->

<!--                    <div class="col-lg-7 col-12">-->
<!--                        <div class="row">-->
<!--                            <div class="col-lg-4 col-md-4 col-12 mt-4 pt-2 mt-lg-0 pt-lg-0">-->
<!--                                <h5 class="text-light footer-head font-weight-normal mb-0">Landing</h5>-->
<!--                                <ul class="list-unstyled footer-list mt-4">-->
<!--                                    <li><a href="javascript:void(0)" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i>Landing One</a></li>-->
<!--                                    <li><a href="javascript:void(0)" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i>Landing Two</a></li>-->
<!--                                    <li><a href="javascript:void(0)" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i>Landing Three</a></li>-->
<!--                                    <li><a href="javascript:void(0)" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i>Landing Four</a></li>-->
<!--                                    <li><a href="javascript:void(0)" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i>Landing Five</a></li>-->
<!--                                    <li><a href="javascript:void(0)" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i>Landing Six</a></li>-->
<!--                                </ul>-->
<!--                            </div>-->

<!--                            <div class="col-lg-4 col-md-4 col-12 mt-4 pt-2 mt-lg-0 pt-lg-0">-->
<!--                                <h5 class="text-light footer-head font-weight-normal mb-0">About</h5>-->
<!--                                <ul class="list-unstyled footer-list mt-4">-->
<!--                                    <li><a href="javascript:void(0)" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i>About us</a></li>-->
<!--                                    <li><a href="javascript:void(0)" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i>Contact us</a></li>-->
<!--                                    <li><a href="javascript:void(0)" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i>Terms & Services</a></li>-->
<!--                                    <li><a href="javascript:void(0)" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i>Privacy Policy</a></li>-->
<!--                                </ul>-->
<!--                            </div>-->

<!--                            <div class="col-lg-4 col-md-4 col-12 mt-4 pt-2 mt-lg-0 pt-lg-0">-->
<!--                                <h5 class="text-light footer-head font-weight-normal mb-0">Office</h5>-->
<!--                                <ul class="list-unstyled footer-list mt-4">-->
<!--                                    <li><i data-feather="map-pin" class="fea icon-sm mr-2"></i><a href="javascript:void(0)" class="text-foot">Londan, England</a></li>-->
<!--                                    <li><i data-feather="mail" class="fea icon-sm mr-2"></i><a href="mailto:contact@example.com" class="text-foot">test@yourdomain.com</a></li>-->
<!--                                    <li><i data-feather="phone" class="fea icon-sm mr-2"></i><a href="tel:+152534-468-854" class="text-foot">+(125) 1254-5487</a></li>-->
<!--                                </ul>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
<!--        </footer>-->
<!--        <footer class="bg-dark footer-bar py-4">-->
<!--            <div class="container">-->
<!--                <div class="row justify-content-center">-->
<!--                    <div class="col-12 text-center">-->
<!--                        <p class="foot-color mb-0">© <script>document.write(new Date().getFullYear())</script> landkey. Design by <a href="javascript:void(0)" class="text-reset">Zoyothemes</a>.</p>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
<!--        </footer>-->
<!--        &lt;!&ndash; End Footer &ndash;&gt;-->

<!--        &lt;!&ndash; Back to top &ndash;&gt;-->
<!--        <a href="#" class="back-to-top rounded text-center" id="back-to-top">-->
<!--            <i class="mdi mdi-chevron-up d-block"> </i>-->
<!--        </a>-->
<!--        &lt;!&ndash; Back to top &ndash;&gt;-->

        <!-- javascript -->
        <script src="js/jquery.min.js"></script>
        <script src="js/bootstrap.bundle.min.js"></script>
        <script src="js/jquery.easing.min.js"></script>
        <script src="js/scrollspy.min.js"></script>
        <!-- Magnific popup -->
        <script src="js/jquery.magnific-popup.min.js"></script>
        <script src="js/magnific.init.js"></script>
        <!-- Parallax -->
        <script src="js/parallax.js"></script>
        <!-- 图标库 -->
        <script src="js/bundle.js"></script>
        <script src="js/feather.min.js"></script>
        <!-- Contact -->
        <script src="js/contact.js"></script>
        <!-- Main Js -->
        <script src="js/app.js"></script>
    </body>
</html>